<script type="text/javascript" src="{{$LAYOUT_HELPER_URL}}front/scripts/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="{{$LAYOUT_HELPER_URL}}front/scripts/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="{{$LAYOUT_HELPER_URL}}front/scripts/fancybox/jquery.fancybox-1.3.4.css" media="screen" />

<script type="text/javascript">
	jQuery(document).ready(function() {
		$("a.full_image").fancybox({'titleShow':false});

		jQuery("ul.TabSection li a").click(function(){
			jQuery(this).parent().parent().find('li').removeClass('ActiveTab');
			jQuery(this).parent().addClass('ActiveTab');
			var d = jQuery(this).attr('href');
			jQuery('.property_tab').hide();
			jQuery(d).show();
			return false;
		});
		jQuery("ul.TabSection li a").filter(":first").trigger('click');
	});
</script>

<div id="section03">
        <div id="mainContent">
            <div class="GraySection01">
                <!--Choice Section-->
                <div class="container_12">
                    <div class="grid_7">
                        <h2 class="Title03">{{$product.title}}&nbsp;&nbsp;<span>{{$product.sku}}</span></h2>
                    </div>
                    <div class="grid_5">
                        <table border="0" cellpadding="0" cellspacing="0" class="SocialShare01">
                             <tr>
                                {{sticker name=front_social_buttons}}
                                <td>
                                    <p class="ButtonStyle02"><a href="javascript:history.back();" title="Back">Back</a></p>
                                </td>
                             </tr>
                        </table>
                    </div>
                    <div class="clear"></div>
                </div>
                <!--end: Choice Section-->
            </div>
            
            <!--White Section-->
            <div class="WhiteSection">
                <div class="container_12">
                    <div class="P35tb">
                        <div class="ProductDetail">
                            <div class="grid_6 ProductImage02">
                                <img src="{{$BASE_URL}}{{$product.main_image}}" alt="{{$product.title}}" />
                                <div class="Pos02">
                                    <p class="ButtonFull01"><a class="full_image" href="{{$BASE_URL}}{{$product.full_image}}" title="Full">Full</a></p>
                                </div>
                            </div>
                            <div class="grid_6">
                                <div class="P20lr">
                                    <div class="ProductTitle">
                                        <div class="W240Left">
                                            <h3 class="Title05">Description</h3>
                                        </div>
                                        <div class="W170Right">
                                            <p class="Title04">RRP  $ {{$product.price}}</p>
                                        </div>
                                    </div>
                                    
                                    <div class="ProductText">
                                        {{$product.intro_text}}
                                        {{$product.full_text}}
                                    </div>
                                    {{if $product.files|@count > 0}}
                                    <div class="ProductTitle M15top">
                                        <h3 class="Title05">Downloads</h3>
                                    </div>
                                    <div class="ProductText">
                                    	{{foreach from=$product.files item=file}}
                                        <p><a href="{{$BASE_URL}}{{$file.url}}" title="download"><img src="{{$LAYOUT_HELPER_URL}}front/images/dummy.gif" alt="Icon" class="uiIcon initIcon05" />&nbsp;&nbsp;{{$file.name}}</a></p>
                                    	{{/foreach}}
                                    </div>
                                    {{/if}}
                                </div>
                            </div>
                            <div class="clear"></div>
                        </div>
                        {{if $product.properties|@count > 0 }}
                        <div class="grid_12">
                            <ul class="TabSection">
                            	{{foreach from=$product.properties item=tab}}
                                <li><a href="#tab{{$tab.product_property_id}}" title="{{$tab.title}}"><span>{{$tab.title}}</span></a></li>
                                {{/foreach}}
                            </ul>
                        </div>
                        <div class="clear"></div>
                        
                        <div class="grid_12">
                            <div class="GrayBox">
                            	{{foreach from=$product.properties item=tab2}}
                                <div class="W900 Container03 property_tab" id="tab{{$tab2.product_property_id}}">
                                   {{$tab2.description}}
                                </div>
                                {{/foreach}}
                            </div>
                        </div>
                        {{/if}}
                        <div class="clear"></div>
                    </div>
                </div>
            </div>
            <!--end: White Section-->

            <!--Black Section-->
            <div class="BlackSection01"></div>
            <!--end: Black Section-->
        </div>
    </div>